<template>
    <a-form ref="formRef" layout="vertical" :label-col="labelCol" :wrapper-col="wrapperCol" :model="formData">
        <a-tabs>
            <a-tab-pane key="base" tab="基础设置">
                <div :class="$style.form">
                    <a-form-item label="静态资源url" name="staticUrl">
                        <a-input type="text" v-model:value="formData.staticUrl" />
                    </a-form-item>
                    <!-- <a-form-item label="设备二维码规则" name="devceQr">
                        <a-input type="text" v-model:value="formData.deviceQr" />
                    </a-form-item> -->
                </div>
            </a-tab-pane>
            <a-tab-pane key="wechat" tab="微信">
                <div :class="$style.form">
                    <a-form-item label="公众号appid" :name="['wechat', 'appid']">
                        <a-input type="text" v-model:value="formData.wechat.gzhAppid" />
                    </a-form-item>
                    <a-form-item label="公众号secret" :name="['wechat', 'gzhSecret']">
                        <a-input type="text" v-model:value="formData.wechat.gzhSecret" />
                    </a-form-item>
                    <!-- <a-form-item label="商户号" :name="['wechat', 'mchid']">
                        <a-input type="text" v-model:value="formData.wechat.mchid" />
                    </a-form-item>
                    <a-form-item label="服务id" :name="['wechat', 'serviceId']">
                        <a-input type="text" v-model:value="formData.wechat.serviceId" />
                    </a-form-item>
                    <a-form-item label="v3key" :name="['wechat', 'v3Key']">
                        <a-input type="text" v-model:value="formData.wechat.v3Key" />
                    </a-form-item>
                    <a-form-item label="notifyUrl" :name="['wechat', 'notifyUrl']">
                        <a-input type="text" v-model:value="formData.wechat.notifyUrl" />
                    </a-form-item>
                    <a-form-item label="秘钥" :name="['wechat', 'secret']">
                        <a-input type="text" v-model:value="formData.wechat.secret" />
                    </a-form-item>
                    <a-form-item label="公钥" :name="['wechat', 'publicKey']">
                        <a-textarea v-model:value="formData.wechat.publicKey" />
                    </a-form-item>
                    <a-form-item label="私钥" :name="['wechat', 'privateKey']">
                        <a-textarea v-model:value="formData.wechat.privateKey" />
                    </a-form-item>
                    <a-form-item label="充电结束通知模板" :name="['wechat', 'chargeFinishMsgTemplate']">
                        <a-input v-model:value="formData.wechat.chargeFinishMsgTemplate" />
                    </a-form-item>
                    <a-form-item label="充电结束消息函数" :name="['wechat', 'chargeFinishMsgFunc']">
                        <a-textarea v-model:value="formData.wechat.chargeFinishMsgFunc" />
                    </a-form-item> -->
                </div>
            </a-tab-pane>

            <a-tab-pane key="openAccount" tab="open account">
                <div :class="$style.form">
                    <a-form-item label="appid" :name="['openAccount', 'appid']">
                        <a-input type="text" v-model:value="formData.openAccount.appid" />
                    </a-form-item>
                    <a-form-item label="secret" :name="['openAccount', 'secret']">
                        <a-input type="text" v-model:value="formData.openAccount.secret" />
                    </a-form-item>
                    <a-form-item label="token接口" :name="['openAccount', 'tokenUrl']">
                        <a-input type="text" v-model:value="formData.openAccount.tokenUrl" />
                    </a-form-item>
                    <a-form-item label="数据接口" :name="['openAccount', 'apiUrl']">
                        <a-input type="text" v-model:value="formData.openAccount.apiUrl" />
                    </a-form-item>
                    <a-form-item label="单位信息接口标识" :name="['openAccount', 'deptApiId']">
                        <a-input type="text" v-model:value="formData.openAccount.deptApiId" />
                    </a-form-item>
                    <a-form-item label="教职工接口标识" :name="['openAccount', 'teacherApiId']">
                        <a-input type="text" v-model:value="formData.openAccount.teacherApiId" />
                    </a-form-item>
                    <a-form-item label="本专科学生接口标识" :name="['openAccount', 'ordinaryStuApiId']">
                        <a-input type="text" v-model:value="formData.openAccount.ordinaryStuApiId" />
                    </a-form-item>
                    <a-form-item label="研究生接口标识" :name="['openAccount', 'postgraduateStuApiId']">
                        <a-input type="text" v-model:value="formData.openAccount.postgraduateStuApiId" />
                    </a-form-item>
                </div>
            </a-tab-pane>

            <a-tab-pane key="openapi" tab="openapi">
                <div :class="$style.form">
                    <a-form-item label="appId" :name="['openapi', 'appId']">
                        <a-input type="text" v-model:value="formData.openapi.appId" />
                    </a-form-item>
                    <a-form-item label="appSecret" :name="['openapi', 'appSecret']">
                        <a-input type="text" v-model:value="formData.openapi.appSecret" />
                    </a-form-item>
                    <a-form-item label="token接口" :name="['openapi', 'tokenUrl']">
                        <a-input type="text" v-model:value="formData.openapi.tokenUrl" />
                    </a-form-item>
                    <a-form-item label="代办接口" :name="['openapi', 'taskListUrl']">
                        <a-input type="text" v-model:value="formData.openapi.taskListUrl" />
                    </a-form-item>
                    <a-form-item label="代办详情接口" :name="['openapi', 'taskUrl']">
                        <a-input type="text" v-model:value="formData.openapi.taskUrl" />
                    </a-form-item>
                    <a-form-item label="消息接口" :name="['openapi', 'messageListUrl']">
                        <a-input type="text" v-model:value="formData.openapi.messageListUrl" />
                    </a-form-item>
                </div>
            </a-tab-pane>

            <a-tab-pane key="newsapi" tab="新闻api">
                <div :class="$style.form">
                    <a-form-item label="接口地址" :name="['newsapi', 'url']">
                        <a-input type="text" v-model:value="formData.newsapi.url" />
                    </a-form-item>
                    <a-form-item label="owner" :name="['newsapi', 'owner']">
                        <a-input type="text" v-model:value="formData.newsapi.owner" />
                    </a-form-item>
                </div>
            </a-tab-pane>


            <!-- <a-tab-pane key="alipay" tab="支付宝">
                <div :class="$style.form">
                    <a-form-item label="appId" :name="['alipay', 'appId']">
                        <a-input type="text" v-model:value="formData.alipay.appId" />
                    </a-form-item>
                    <a-form-item label="AES" :name="['alipay', 'aes']">
                        <a-input type="text" v-model:value="formData.alipay.aes" />
                    </a-form-item>
                    <a-form-item label="notifyUrl" :name="['alipay', 'notifyUrl']">
                        <a-input type="text" v-model:value="formData.alipay.notifyUrl" />
                    </a-form-item>
                    <a-form-item label="支付宝公钥" :name="['alipay', 'alipayPublicKey']">
                        <a-input type="text" v-model:value="formData.alipay.alipayPublicKey" />
                    </a-form-item>
                    <a-form-item label="应用公钥" :name="['alipay', 'appCertContent']">
                        <a-input type="text" v-model:value="formData.alipay.appCertContent" />
                    </a-form-item>
                    <a-form-item label="应用私钥" :name="['alipay', 'privateKey']">
                        <a-input type="text" v-model:value="formData.alipay.privateKey" />
                    </a-form-item>
                </div>
            </a-tab-pane> -->
            <!-- <a-tab-pane key="2" tab="阿里云">
                <div :class="$style.form">
                    <a-form-item label="uid" :name="['alicloud', 'uid']">
                        <a-input type="text" v-model:value="formData.alicloud.uid" />
                    </a-form-item>
                    <a-form-item label="accessKeyId" :name="['alicloud', 'appid']">
                        <a-input type="text" v-model:value="formData.alicloud.accessKeyId" />
                    </a-form-item>
                    <a-form-item label="accessKeySecret" :name="['alicloud', 'accessKeySecret']">
                        <a-input type="text" v-model:value="formData.alicloud.accessKeySecret" />
                    </a-form-item>
                    <a-form-item label="regionId" :name="['alicloud', 'regionId']">
                        <a-input type="text" v-model:value="formData.alicloud.regionId" />
                    </a-form-item>
                    <a-form-item label="consumerGroupId" :name="['alicloud', 'consumerGroupId']">
                        <a-input type="text" v-model:value="formData.alicloud.consumerGroupId" />
                    </a-form-item>
                </div>
            </a-tab-pane> -->
        </a-tabs>
        <a-button type="primary" @click="submit" :loading="loading">保存</a-button>
    </a-form>
</template>

<script lang="ts" setup>
    import { getConfigApi, updateConfigApi } from '@/api/system/PlatformConfig'
    import { useI18nStore } from '@/store/i18n';
    import { message } from 'ant-design-vue';
    import { ref } from 'vue';
    const labelCol = { span: 12 }
    const wrapperCol = { span: 14 }

    const i18n = useI18nStore()
    const loading = ref(false)


    const formRef = ref()
    const formData = ref({
        id : 0,
        staticUrl : '',
        //deviceQr : '',
        wechat : {
            gzhAppid : '',
            gzhSecret : '',
            // mchid : '',
            // serviceId : '',
            // v3Key : '',
            // secret : '',
            // notifyUrl : '',
            // publicKey : '',
            // privateKey : '',
            // chargeFinishMsgTemplate : '',
            // chargeFinishMsgFunc : ''
        },

        openAccount : {
            appid : '',
            secret : '',
            tokenUrl : '',
            apiUrl : '',
            deptApiId : '',
            ordinaryStuApiId : '',
            postgraduateStuApiId : '',
            teacherApiId : ''
        },

        openapi : {
            appId : '',
            appSecret : '',
            tokenUrl : '',
            taskListUrl :'',
            taskUrl :'',
            messageListUrl : ''
        },

        newsapi : {
            url : '',
            owner : '',
        },


        // alipay : {
        //     appId : '',
        //     aes : '',
        //     notifyUrl : '',
        //     //支付宝公钥
        //     alipayPublicKey : '',
        //     //应用公钥
        //     appCertContent : '',

        //     //应用私钥
        //     privateKey : '',
        // },

        // alicloud : {
        //     uid : '', //账号id 您可登录物联网平台控制台，移动鼠标指针到账号头像，查看账号ID。
        //     accessKeyId : '',
        //     accessKeySecret : '',
        //     regionId : '', //请替换为您的物联网平台设备所在地域的Region ID。Region ID表达方法，请参见支持的地域。
        //     consumerGroupId : '',
        // }
    })


    async function submit() {
        loading.value = true
        await updateConfigApi(formData.value)
        loading.value = false
        message.success(i18n.t('saveSuccess'))
    }


    getConfigApi().then(res => {
        if(res.data) {
            for(let k in formData.value) {
                if(res.data[k]) {
                    formData.value[k] = res.data[k]
                }
            }
        }
    })

</script>

<style lang="scss" module>
    .form{
        width: 600px;
    }
</style>